<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8"/>
	<title>定投产品列表</title>
	<link rel="stylesheet" type="text/css" th:href="@{/layui/css/layui.css}" media="all" />
	<link rel="stylesheet" type="text/css" th:href="@{/css/news.css}" media="all" />
</head>
<body class="childrenBody" style="width:1400px;">
	<blockquote class="layui-elem-quote news_search">
	<form id="searchForm" name="searchForm" class="layui-form" action="/product/regular/regularProduct.html">
 		<input type="hidden" id="pageNum" name="pageNum" th:value="${page}?${page.pageNum}"/>
		  <div class="layui-form-item">
			<label class="layui-form-label">产品编码:</label>
		    <div class="layui-input-inline">
		    	 <input  type="text" class="layui-input" name="code"  th:value="${regularProductVo}?${regularProductVo.code}"/>
		    </div>
			<label class="layui-form-label">产品名称:</label>
		    <div class="layui-input-inline">
		    	 <input  type="text" class="layui-input" name="name"  th:value="${regularProductVo}?${regularProductVo.name}"/>
		    </div>
			  <label class="layui-form-label">产品状态</label>
			  <div class="layui-input-inline">
				  <select name="status"  lay-filter="status">
					  <option value="">请选择查询产品状态</option>
					  <option value="0" th:selected="${regularProductVo}ne null  and ${regularProductVo.status == 0}">草稿未上架</option>
					  <option value="1" th:selected="${regularProductVo}ne null  and ${regularProductVo.status == 1}">上架未开售</option>
					  <option value="2" th:selected="${regularProductVo}ne null  and ${regularProductVo.status == 2}">正在销售中</option>
					  <option value="3" th:selected="${regularProductVo}ne null  and ${regularProductVo.status == 3}">售磬未下架</option>
					  <option value="4" th:selected="${regularProductVo}ne null  and ${regularProductVo.status == 4}">下架</option>
				  </select>
			  </div>
		    <button class="layui-btn search_btn"><i class="layui-icon">&#xe615;</i>查询</button>
            <a class="layui-btn layui-btn-normal newsAdd_btn" id="add"><i class="layui-icon">&#xe608;</i>添加</a>
         </div>
	</form>
	</blockquote>
	<div class="layui-form news_list">
	  	<table class="layui-table">
		    <colgroup>
				<col/>
				<col/>
				<col/>
				<col/>
				<col/>
				<col/>
		    </colgroup>
		    <thead>
				<tr>
					<th>产品编码</th>
					<th>产品名称</th>
					<th>投向产品</th>
					<th>状态</th>
					<th>创建时间</th>
					<th>操作</th>
				</tr> 
		    </thead>
		    <tbody class="news_content">
		  	  <th:block th:if="${not #lists.isEmpty(page.list)}">
			    	<tr th:each="item:${page.list}">
				    	<td  th:text="${item.code}"></td>
				    	<td  th:text="${item.name}"></td>
						<td  th:text="${item.targetProdName}"></td>
						<th:block th:switch="${item.status}">
						    <td  th:case="0">草稿未上架</td>
							<td  th:case="1">上架未开售</td>
							<td  th:case="2">正在销售中</td>
							<td  th:case="3">售磬未下架</td>
							<td  th:case="4">下架</td>
						</th:block>
						<td  th:text="${#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}"></td>
				    	<td>
							<a th:data="${item.id}" th:remove="${item.status == 0 or item.status == 4}?none:all" class="layui-btn layui-btn-mini shelves">上架</a>
							<a th:data="${item.id}"  th:remove="${item.status == 1}?none:all" class="layui-btn layui-btn-mini sale">开售</a>
							<a th:data="${item.id}"  th:remove="${item.status == 2 or item.status == 3}?none:all" class="layui-btn layui-btn-mini offShelf">下架</a>
                            <a th:data="${item.id}"  class="layui-btn layui-btn-mini product_info">查看</a>
					    	<a th:data="${item.id}"  th:remove="${item.status == 0 or item.status == 4}?none:all"  class="layui-btn layui-btn-mini product_edit">编辑</a>
						</td>
					</tr>
				</th:block>
		    </tbody>
		</table>
	</div>
	<div id="paged" align="right"></div>
	<script type="text/javascript" th:src="@{/layui/layui.js}"></script>
    <script type="text/javascript" th:src="@{/jquery/jquery-3.2.1.min.js}"></script>
	</body>
	<script th:inline="javascript">
	   layui.use('laypage', function(){
     	  var laypage = layui.laypage;
     	  //执行一个laypage实例
     	  laypage.render({
     	    elem: 'paged', //注意，这里的 test1 是 ID，不用加 # 号
     	    curr: [[${page.pageNum}]],
     	    count: [[${page.total}]], //数据总数，从服务端得到
     	    layout: ['count', 'prev', 'page', 'next'],
             jump: function(obj, first){
                 //得到了当前页，用于向服务端请求对应数据
                 var curr = obj.curr;
                 $("#pageNum").val(curr);
                 if(!first) {
                     $("#searchForm").submit();
					}
             }
     	  });
     	});
     
     layui.use('layer', function(){
         var layer = layui.layer,$=layui.jquery;

         $(".shelves").bind("click",function () {
             var id = $(this).attr('data');
             layer.confirm('确定要上架吗?', {icon: 3, title:'提示'}, function(index){
                 $.post('updateProductStatus.html', {id:id,status:1}, function(data){
                     location.reload();
                 });
             });
         });

         $(".offShelf").bind("click",function () {
             var id = $(this).attr('data');
             layer.confirm('确定要下架该产品吗?', {icon: 3, title:'提示'}, function(index){
                 $.post('updateProductStatus.html', {id:id,status:4}, function(data){
                     location.reload();
                 });
             });
         });
         $(".sale").bind("click",function () {
             var id = $(this).attr('data');
             layer.confirm('确定要销售该产品吗?', {icon: 3, title:'提示'}, function(index){
                 $.post('updateProductStatus.html', {id:id,status:2}, function(data){
                     location.reload();
                 });
             });
         });
         
         //查看
         $(".product_info").bind("click",function() {
             var id = $(this).attr("data");
             //Ajax获取
         	$.post('regularProductInfo.html', {id:id}, function(data){
         	  	layer.open({
         	  	  type: 1,
           		  title:'查看定投产品'
           		  ,area: ['1000px', '450px']
           		  ,shade: 0
           		  ,content: data
        			  ,yes: function(index, layero){
        				  layer.close(index);
        				}
           		}); 
         	}); 
         });

         //编辑
         $(".product_edit").bind("click",function() {
             var id = $(this).attr("data");
             //Ajax获取
         	form_html(id,'编辑定投产品');
         });

         /**
			 * 添加
          */
         $("#add").bind("click",function() {
         	//Ajax获取
         	form_html("",'添加定投产品');
         });
         
          function form_html(id,title){
           	$.post('regularProductAdd.html', {id:id}, function(data){
         	  	layer.open({
         	  	  type: 1,
           		  title: title
           		  ,area: ['520px', '450px']
           		  ,shade: 0
           		  ,content: data
        			  ,yes: function(index, layero){
        				  layer.close(index);
        				}
           		}); 
         	}); 
         };
     });


      layui.use('form', function(){
          var form = layui.form;
          form.render();
      });
	</script>
</html>